<!--
 * @Description: 
 * @Version: 1.0
 * @Autor: chen_yt
 * @Date: 2022-07-13 13:56:35
 * @LastEditors: chen_yt
 * @LastEditTime: 2022-07-15 14:46:34
-->
<template>
  <fks-dialog
    :visible.sync="Visible"
    :append-to-body="true"
    width="960px"
    :title="LANG.MEMBER"
    @close="close"
  >
    <div slot="title">
      <i class="fks-icon-user" />
      {{ LANG.MEMBER }}
    </div>
    <div class="contain">
      <fks-query-page
        ref="peopleTable"
        v-loading="loading"
        :data="list"
        :current-page.sync="pageNo"
        :page-size.sync="pageSize"
        :total="total"
        @sort-change="sortHandler"
        @query="getAdmins"
      >
        <template slot="singleSearch">
          <div class="single-searchBox">
            <fks-input
              v-model="searchValue"
              size
              class="single-searchBox-item"
              :placeholder="LANG.MEMBER_SEARCH_PLACEHOLDER"
              clearable
              maxlength="50"
              @clear="search"
              @keyup.enter.native="search"
            >
              <fks-button
                slot="append"
                icon="fks-icon-search"
                @click="search"
              />
            </fks-input>
          </div>
        </template>
        <template>
          <fks-table-column type="index" align="center" label="#" />
          <fks-table-column
            align="center"
            :label="LANG.USER_FULL_NAME"
            prop="userFullname"
            sortable="custom"
            min-width="120"
          >
            <template slot-scope="scope">
              {{ scope.row.userFullname }}
            </template>
          </fks-table-column>
          <fks-table-column
            :label="LANG.USERNAME"
            min-width="120"
            prop="userName"
            align="center"
            sortable="custom"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.userName }}</span>
            </template>
          </fks-table-column>
        </template>
      </fks-query-page>
    </div>
  </fks-dialog>
</template>

<script>
import { getRoleInOtherTenantByCode, getRoleUsersInOtherTenant } from './api'

export default {
  name: 'TenantAdmin',
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    tenantConfig: {
      default() {
        return {
          clientId: '',
          tenantId: ''
        }
      }
    }
  },
  data() {
    return {
      list: [],
      loading: false,
      pageNo: 1,
      pageSize: 20,
      sort: '',
      columnName: '',
      total: 0,
      searchValue: '',
      Visible: false
    }
  },
  computed: {},
  watch: {
    visible(val) {
      this.Visible = val
      if (val) {
        this.clearData()
        this.getAdmins()
      }
    }
  },
  methods: {
    //列表排序
    sortHandler(data) {
      if (!data.order) {
        this.sort = ''
        this.columnName = ''
      } else {
        this.sort = data.order == 'ascending' ? 'asc' : 'desc'
        this.columnName =
          data.prop == 'userFullname' ? 'user_fullname' : 'user_name'
      }
      this.getAdmins()
    },

    //获取岗位下人员数据
    getAdmins() {
      let { pageNo, pageSize, searchValue, sort, columnName } = this

      let params = {
        pageNo,
        pageSize,
        searchValue,
        sort,
        columnName
      }

      let { clientId, tenantId } = this.tenantConfig

      if (!clientId || !tenantId) {
        return
      }

      let tenant = { clientId, tenantId }
      let roleCode = `tenant_admin${tenantId}`
      this.loading = true

      getRoleInOtherTenantByCode(roleCode, tenant)
        .then((res) => {
          if (res.status && res.data) {
            return Promise.resolve(res.data.id)
          } else {
            return Promise.reject('')
          }
        })
        .then((roleId) => {
          let temp = { ...params, roleId }
          return getRoleUsersInOtherTenant(temp, tenant)
        })
        .then((res) => {
          if (res.status && res.data) {
            this.list = res.data.list
            this.total = res.data.total
          }
        })
        .finally(() => {
          this.loading = false
        })
    },
    close() {
      this.clearData()
      this.$emit('update:visible', false)
    },
    clearData() {
      this.searchValue = ''
      this.pageNo = 1
      this.total = 0
      this.list = []
      this.sort = ''
      this.columnName = ''
    },
    //清空搜索条件回调
    search() {
      this.pageNo = 1
      this.getAdmins()
    }
  }
}
</script>

<style lang="scss" scoped>
.contain {
  position: relative;
  height: calc(92vh - 225px);
}

::v-deep .fks-query-page {
  margin: 0 !important;
}

::v-deep .fks-dialog__body {
  padding: 0;

  .fks-title-icon {
    display: none;
  }
}
</style>